
<form class="layui-form seller-form" action="">
    <div class="layui-form-item">
    
        <div class="layui-inline">
            <label class="layui-form-label seller-inline-2">班级：</label>
            <div class="layui-input-inline">
                <input type="text" id="bjmc" name="bjmc" lay-verify="title" placeholder="请输入班级名称" autocomplete="off" class="layui-input">
            </div>
        </div> 

        <div class="layui-inline">
            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="unrel_search"><i 
                    class="iconfont icon-chaxun"></i>查询</button>    
        </div>
    </div>

</form>

<div class="table-body">
    <table id="studentUnrelUserTable" lay-filter="studentUnrelUserTable"></table>
</div>

<script>
    layui.use(['table','form','layer'],function(){
        var layer = layui.layer, table = layui.table,form = layui.form;
        //执行渲染
        table.render({
            elem: '#studentUnrelUserTable', //指定原始表格元素选择器（推荐id选择器）
            height: '340',
            cellMinWidth: '80',
            page: 'true',
            limit:'20',
            id:'studentUnrelUserTable',
            url: "{:url('PlanStudentRel/getStudentUnrelList')}",
            cols: [[ //标题栏
                {type:'numbers'},
                { field: 'bmmc', sort: true, title: '部/院', width: 120, align: 'center' },
                { field: 'zymc', sort: true, title: '专业', width: 200, align: 'center' },
                { field: 'bjmc', sort: true, title: '班级', width: 240, align: 'center' },
                { field: 'dir', sort: true, title: '方向', width: 80, align: 'center' },
            ]] //设置表头
            //,…… //更多参数参考右侧目录：基本参数选项
        });

        // 查询
        form.on('submit(unrel_search)', function (data) {
            table.reload('studentUnrelUserTable', {
                where: data.field,
            });

            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    })
</script>